
$(document).ready(function () {

    // 常见问题列表滚动
    var ulObj = $("#suggest ul");
    var top = 0;

    var timerInterval = setInterval(function(){
        top -= 120;
        ulObj.animate({"top": (top + 'px')}, 1500, function(){
            if (top <= -240) {
                top = 0;
                ulObj.css("top", 0);
            }
        });
    }, 3500);

    // 点击常见问题某一个
    ulObj.on("click", "li", function () {
        var content = '安置房什么时候可以买卖?拆迁安置房一般需五年才能进行上市交易。房屋能不能上市交易，简单的可以根据土地性质判断，集体土地，是归集体所有，乡镇多半是这样的土地性质。如果是国有土地，即可办理到房产证，就可以上市交易，有些是永远拿不到房产证的，比如集体土地，除非他进行土地性质变更。有些是拿到了短时间内不能交易的，比如一些拆迁安置房。国家在这方面都是有相关规定的。房产一般有两证，房产证和土地证，房产证简单的说就是表示这房子归你所有，如果建筑物没了，你想再在原土地上兴建，必须经相关部门批准。土地证表示此土地归你所有，无论建筑物是否存在，别人是无权在你的地盘建东西的，这就是侵犯你的权益。' ;
        appendMessage(content, "come");
    });

    var textBox = $(".textBox");
    var voiceBox = $(".voiceBox");
    var recordIcon = $("#recordIcon");
    var keyboradBtn = $("#keyboradBtn");
    var sendBtn = $("#sendBtn");
    var textInput = $("input");
    var recordBtn = $(".recordBtn");
    var messageList = $(".messageList");

    /* 切换到文本输入键盘 */
    recordIcon.click(function () {
        textBox.hide();
        voiceBox.show();
    });

    /* 切换到录音键盘 */
    keyboradBtn.click(function () {
        textBox.show();
        voiceBox.hide();
    });

    /* 点击发送按钮 */
    sendBtn.click(function () {

        var text = textInput.val();

        if (text.length <= 0) {
            $.toast("请输入消息!");
            return;
        }

        appendMessage(text);

    });

    /**
     * 发送消息到列表
     * content: 消息内容(文本消息传字符串,录音消息传秒数)
     * source: to 代表发出去的消息  come 代表收到的消息
     * type: 消息类型:1.text文本消息  2.voice录音消息
     */
    function appendMessage(content, source = "to", type = "text") {

        if (content.length <= 0) { return; }

        var message = "";
        var avatar = source == 'to' ? "images/avatar2.jpeg" : "images/avatar.png";

        if (type == "text") {
            message = `<div class="${source}">
                            <img src="${avatar}" alt="头像" class="avatar">
                            <div class="content">${content}</div>
                        </div>`;

        }else if (type == "voice") {

            // 根据秒数计算录音需要显示的宽度
            var maxLength = 220;
            var minLength = 40;
            var maxSecond = 30;// 30秒
            var length = parseInt(content) * maxLength / maxSecond;

            if (length < minLength) {
                length = minLength;
            }else if (length > maxLength) {
                length = maxLength;
            }

            message = `<div class="${source}">
                            <img src="${avatar}" alt="头像" class="avatar">
                            <div class="voice unselectable">
                                <div class="second" style="width: ${length}px">${content}s"</div><span class="voiceWave"></span></div>
                            </div>
                       </div>`;
        }

        textInput.val("");
        messageList.append($(message));
        scrollToLastMessage();
    }


    /* 滚动到聊天列表底部 */
    function scrollToLastMessage() {
        messageList.animate({
            scrollTop: messageList.scrollHeight()
        }, 500);
    }

    // 一开始就滚动到最底部
//  scrollToLastMessage();


    // 长按录音事件处理
    var timeOutEvent = 0; // 长按标记
    var isCancel = false; // 取消录音标记
    var maxDelta = 50; // 最多滑动距离
    var start = null;  // 录音开始时间

    // 录音提示框
    var recordToast = $(".recordToast");
    var recordStatusIcon = $(".recordStatusIcon");
    var recordStatus = $(".recordStatus");

    // 长按录音键
    recordBtn.on({
        touchstart: function (e) {
            start = new Date().getTime();//起始时间
            timeOutEvent = setTimeout(startRecord, 500);
            e.preventDefault();
            stopPlayRecord();
        },
        touchmove: function (e) {
            clearTimeout(timeOutEvent);
            timeOutEvent = 0;

            var currentY = e.touches[0].clientY;
            var top = $(this).offsetParent().offset().top;
            if ((top - currentY) > maxDelta) {
                isCancel = true;
                recordBtn.html("松开取消");
                recordStatus.html("松开手指,取消发送");
                recordToast.addClass("cancel");
            }else {
                isCancel = false;
                recordBtn.html("松开结束");
                recordStatus.html("手指上滑,取消发送");
                recordToast.removeClass("cancel");
            }
        },
        touchend: function () {

            recordBtn.html("开始录音");
            recordToast.removeClass("cancel");

            clearTimeout(timeOutEvent);
            if (timeOutEvent != 0) {
                alert("录音时长太短...");
                console.log("你这是点击，不是长按");
            }else if (isCancel) {
                cancelRecord();
            }else {
                sendRecord();
            }

            return false;
        }
    });

    /* 开始录音 */
    function startRecord() {
        timeOutEvent = 0;
        recordBtn.html("开始录音");
        recordToast.fadeIn();

        console.log("开始录音start...");
    };

    /* 取消录音 */
    function cancelRecord() {
        isCancel = false;
        timeOutEvent = 0;
        recordToast.hide();
        recordBtn.html("按住说话");
        console.log("取消录音start...");
    };

    /* 发送录音 */
    function sendRecord() {
        timeOutEvent = 0;
        recordToast.fadeOut();
        console.log("发送录音start...");

        // 计算时长
        var end = new Date().getTime();//接受时间
        var second = ((end - start) / 1000);//返回函数执行需要时间

        if (second < 1.2) {
            alert("录音时长太短...");
            console.log("录音时长太短...");
            return;
        }

        second = Math.round(second);
        appendMessage(second, "to", "voice");

    };

    /* 播放录音 */
    var timer = null;
    $(".messageList").on("click", ".voice", function () {

        stopPlayRecord();

        // 播放当前语音消息
        var voiceWave = $(this).children(".voiceWave");
        voiceWave.addClass("play");

        // 获取秒数
        var second = $(this).children(".second").html();
        second = parseInt(second);
        timer = setTimeout(function(){
            voiceWave.removeClass("play");
        }, second * 1000);
    });

    /* 移除正在播放的语音消息状态 */
    function stopPlayRecord() {
        $(".voiceWave").removeClass("play");
        clearTimeout(timer);
        timer = null;
    }

});